import _cloneDeep from 'lodash/cloneDeep';

export function getExtrudeSymbol(
  color = '#ffffff',
  edges = {
    type: 'solid',
    color: '#999',
    size: 0.5,
  },
) {
  return {
    type: 'polygon-3d', // autocasts as new PolygonSymbol3D()
    symbolLayers: [
      {
        type: 'extrude', // autocasts as new ExtrudeSymbol3DLayer()
        material: {
          color: color,
        },
        edges,
      },
    ],
  };
}

export const extrudeUniqueRender = {
  type: 'unique-value', // autocasts as new UniqueValueRenderer()
  defaultSymbol: getExtrudeSymbol(),
  defaultLabel: 'Other',
  field: 'osm_id',
  // field: "TYPE",
  uniqueValueInfos: [
    {
      value: 'Residential',
      symbol: getExtrudeSymbol('#A7C636'),
      label: 'Residential',
    },
    {
      value: 'Commercial',
      symbol: getExtrudeSymbol('#FC921F'),
      label: 'Commercial',
    },
  ],
  visualVariables: [
    {
      type: 'size',
      field: 'Status',
      // valueUnit: 'meters',

      stops: [
        {
          value: '2',
          size: 40,
        },
        {
          value: '3',
          size: 100,
        },
      ],
    },
  ],
};

function getExtrudeUniqueRender(field, valueArr) {
  _cloneDeep(extrudeUniqueRender);

  return {
    type: 'unique-value', // autocasts as new UniqueValueRenderer()
    defaultSymbol: getExtrudeSymbol(),
    defaultLabel: 'Other',
    field,
    // field: "TYPE",
    uniqueValueInfos: [
      {
        value: 'Residential',
        symbol: getExtrudeSymbol('#A7C636'),
        label: 'Residential',
      },
      {
        value: 'Commercial',
        symbol: getExtrudeSymbol('#FC921F'),
        label: 'Commercial',
      },
    ],
    visualVariables: [
      {
        type: 'size',
        field: 'Status',
        // valueUnit: 'meters',

        stops: [
          {
            value: '2',
            size: 40,
          },
          {
            value: '3',
            size: 100,
          },
        ],
      },
    ],
  };
}

export function getUniqueValueInfos(valueArr: any[] = [], color = '#C13538'): any[] {
  if (valueArr.length === 0) {
    return [];
  }
  return valueArr.map(value => {
    return {
      value,
      symbol: getExtrudeSymbol(color),
    };
  });
}
